<!DOCTYPE html>
<html>

	<head>
		<meta charset="utf-8">
		<title>个人中心-网演中国粤西平台</title>
		<meta name="renderer" content="webkit">
		<meta http-equiv="X-UA-Compatible" content="IE=9,Chrome=1">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta name="apple-mobile-web-app-status-bar-style" content="black" />
		<link rel="stylesheet" type="text/css" href="../css/frameCss/animate.css" />
		<link rel="stylesheet" type="text/css" href="../css/public.css">
		<link rel="stylesheet" type="text/css" href="../css/set.css" />
	</head>

	<body>

		<header></header>

		<div id="set-container" class="animated fadeInLeft">
			<div class="nav_guide">
				<ul>
					<li style="position: relative;" class="avatar" id="userImg">
						<span>头像</span>
						<input type="file" style="position: absolute;width: 100%;height: 100%;position: absolute;top: 0;left: 0;opacity: 0;" id="uploadUserImg"/>
						<img src="../images/nothumb.jpg" class="img-circle" width="40" height="40" style="float: right;border-radius: 50%;margin: 6px 40px 0 0;">
					</li>
					<li>
						<a href="changeUserName.html" class="userName">
							<span>账号昵称</span>
							<span style="float: right;margin-right: 40px;">网演</span>
						</a>
					</li>
					<li class="nobg phone">
						<span>绑定手机号</span>
						<span style="float: right;margin-right: 40px;">+86 13360037291</span>
					</li>
					<li class="certification">
						<a href="shiming.html">
							<span>实名认证</span>
						</a>
					</li>
				</ul>
			</div>

			<div class="nav_guide">
				<ul>
					<li>
						<a href="address.html">
							<span>收件地址</span>
						</a>
					</li>
				</ul>
			</div>

			<div class="nav_guide">
				<ul>
					<a href="login.html" style="color:#FF0000;">
						<li class="nobg center">退出登陆</li>
					</a>
				</ul>
			</div>

			<div id="bottom"></div>
		</div>

		<footer id="bar-fixed">
			<a href="../index.html" class="tab-item"><i class="icon-tabbar bar-home"></i>首页</a>
			<a href="../category/category.html" class="tab-item"><i class="icon-tabbar bar-message"></i>分类</a>
			<a href="../publish/index.html" class="tab-item"><i class="icon-tabbar bar-publish"></i>发起</a>
			<a href="../user/index.html" class="tab-item active"><i class="icon-tabbar bar-user2"></i>我</a>
		</footer>

		<script src="../js/frameJS/jquery-2.1.1.min.js" type="text/javascript" charset="utf-8"></script>
		<script type="text/javascript">
			//加载公共头部
			$('header').load('../commonTemplate/common-header.html');

			//点击手机提示
			$('.phone', '#set-container').click(function() {
				alert('已认证的手机不能修改')
			})

			//修改头像
			function changeUserLogo(){
				$('#uploadUserImg').on('change', function(ev) {
					var file = ev.target.files[0] // 获取上传的第一个文件
					ev.target.value = null // 重置 input
					var reader = new FileReader();
					var img = document.getElementsByClassName('img-circle')
					reader.onload = function(ev) {
						// 读取文件完毕
						img[0].src = ev.target.result // 文件的 Base64 值
					}
					reader.readAsDataURL(file);
				})
			}
			changeUserLogo();
		</script>
	</body>

</html>